<template>
    <div class="container">
        <h1>Home</h1>
        <router-view></router-view>
        <van-tabbar v-model="active" route class="fixed-tabbar">
            <van-tabbar-item replace to="/attendance" icon="chart-trending-o">出勤统计</van-tabbar-item>
            <van-tabbar-item replace to="/weekly-class" icon="calendar-o">每周课堂</van-tabbar-item>
            <van-tabbar-item replace to="/course-attendance" icon="bookmark-o">课程出勤</van-tabbar-item>
            <van-tabbar-item replace to="/other-link" icon="bookmark-o">其他链接</van-tabbar-item>
        </van-tabbar>
    </div>
</template>

<script setup>
import { useUserStore } from '@/stores/user';
import { storeToRefs } from 'pinia';
import { ref, provide } from 'vue';

const store = useUserStore();
const { clazzId, week, day } = storeToRefs(store);
const logout = () => {
    store.logout();
}

provide('currentStudent', store.currentStudent);
provide('currentTime', store.currentTime);
</script>

<style scoped>
.container {
    min-height: 100vh;
    position: relative;
    padding-bottom: 50px;
    /* 为tabbar留出空间 */
}

.fixed-tabbar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

ul {
    list-style-type: none;
    padding: 0;
}

li {
    margin: 10px 0;
}
</style>